<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" >

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/turbolinks/5.2.0/turbolinks.js" integrity="sha256-iM4Yzi/zLj/IshPWMC1IluRxTtRjMqjPGd97TZ9yYpU=" crossorigin="anonymous"></script>
  <link href="https://fonts.googleapis.com/css?family=Roboto+Mono" rel="stylesheet">
  <link href="https://fonts.googleapis.com/css?family=Cousine|Inconsolata" rel="stylesheet">
  <link rel="shortcut icon" type="image/png" href="/favicon.png">

  <link rel="stylesheet" href="/css/style.css">
  <link rel="stylesheet" href="/css/css/fontawesome-all.min.css">
  <link rel="stylesheet" href="/css/css/work-sans-v7.css">
  <script src="/js/main.js"></script>

  <!-- Begin Jekyll SEO tag v2.6.1 -->
<title>JS: Create Account | Hive Developer</title>
<meta name="generator" content="Jekyll v4.0.0" />
<meta property="og:title" content="JS: Create Account" />
<meta property="og:locale" content="en_US" />
<meta name="description" content="Create Steem account using Steemconnect as well as with client-side signing." />
<meta property="og:description" content="Create Steem account using Steemconnect as well as with client-side signing." />
<link rel="canonical" href="create_account.html" />
<meta property="og:url" content="create_account.html" />
<meta property="og:site_name" content="Hive Developer" />
<meta property="og:type" content="article" />
<meta property="article:published_time" content="2020-08-26T11:52:22-07:00" />
<script type="application/ld+json">
{"description":"Create Steem account using Steemconnect as well as with client-side signing.","mainEntityOfPage":{"@type":"WebPage","@id":"create_account.html"},"@type":"BlogPosting","url":"create_account.html","headline":"JS: Create Account","dateModified":"2020-08-26T11:52:22-07:00","datePublished":"2020-08-26T11:52:22-07:00","@context":"https://schema.org"}</script>
<!-- End Jekyll SEO tag -->


  
</head>
<body>
<header>
  <h1>
    <button type="button" class="open-nav" id="open-nav"></button>
    <a href="/"  class="logo-link"><img src="/images/logotype_black.svg" height="40" alt="Hive Developer logo"></a>
  </h1>

  
  <form action="/search/" method="get">
    <input type="text" name="q" id="search-input" placeholder="Search">
    <input type="submit" value="Search" style="display: none;">
  </form>
  

  <div id="sidebar" class="sidebar">
	
	
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/">
		<h6 class="ctrl-nav-section title">Introduction</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/#introduction-welcome">Welcome to Hive</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/quickstart/">
		<h6 class="ctrl-nav-section title">Quickstart</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/quickstart/#quickstart-choose-library">Choose Library</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-hive-full-nodes">Hive Nodes</a></li>
						
					
						
						<li><a href="/quickstart/#quickstart-testnet">Hive Testnet</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/tutorials/">
		<h6 class="ctrl-nav-section title">Tutorials</h6>
		<ul class="cont-nav-section content">
			
				
					
						<li><a href="/tutorials/#tutorials-javascript">Javascript</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-python">Python</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-ruby">Ruby</a></li>
					
				
					
						<li><a href="/tutorials/#tutorials-recipes">Recipes</a></li>
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/services/">
		<h6 class="ctrl-nav-section title">Services</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/services/#services-hive-blog">hive.blog</a></li>
						
					
						
						<li><a href="/services/#services-hivesigner">HiveSigner</a></li>
						
					
						
						<li><a href="/services/#services-jussi">Jussi</a></li>
						
					
						
						<li><a href="/services/#services-imagehoster">ImageHoster</a></li>
						
					
						
						<li><a href="/services/#services-dhf">DHF</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/apidefinitions/">
		<h6 class="ctrl-nav-section title">Appbase API</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/apidefinitions/#apidefinitions-condenser-api">Condenser Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-bridge">Bridge</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-by-key-api">Account By Key Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-account-history-api">Account History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-block-api">Block Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-database-api">Database Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-debug-node-api">Debug Node Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-follow-api">Follow Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-jsonrpc">Jsonrpc</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-market-history-api">Market History Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-network-broadcast-api">Network Broadcast Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-rc-api">Rc Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-reputation-api">Reputation Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-rewards-api">Rewards Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-tags-api">Tags Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-transaction-status-api">Transaction Status Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-witness-api">Witness Api</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops">Broadcast Ops</a></li>
						
					
						
						<li><a href="/apidefinitions/#apidefinitions-broadcast-ops-communities">Broadcast Ops Communities</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/resources/">
		<h6 class="ctrl-nav-section title">Resources</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/resources/#resources-overview">Overview</a></li>
						
					
						
						<li><a href="/resources/#resources-client-libs">Client Libraries</a></li>
						
					
						
						<li><a href="/resources/#resources-bluepaper">Bluepaper</a></li>
						
					
						
						<li><a href="/resources/#resources-whitepaper">Whitepaper</a></li>
						
					
						
						<li><a href="/resources/#resources-tools">Tools</a></li>
						
					
						
						<li><a href="/resources/#resources-hivesigner-libs">Hivesigner Libs</a></li>
						
					
						
						<li><a href="/resources/#resources-hive-keychain">Hive Keychain</a></li>
						
					
						
						<li><a href="/resources/#resources-developeradvocate">Community & Help</a></li>
						
					
				
			
		</ul>
	</section>
	
		
    <section class="pnl-main-nav-section main-nav-section" url="/glossary/">
		<h6 class="ctrl-nav-section title">Glossary</h6>
		<ul class="cont-nav-section content">
			
				
					
					
						
						<li><a href="/glossary/#glossary-chain-basics">Chain Basics</a></li>
						
					
						
					
						
						<li><a href="/glossary/#glossary-governance">Governance</a></li>
						
					
						
						<li><a href="/glossary/#glossary-transactions">Transactions</a></li>
						
					
						
						<li><a href="/glossary/#glossary-api">API</a></li>
						
					
						
						<li><a href="/glossary/#glossary-market">Market</a></li>
						
					
				
			
		</ul>
	</section>
	
</div>



  <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
</header>
<div class="main" id="top">
  <div class="hero">
    <h1 class="hero__h1">Hive Developer Portal </h1>
    <img class="hero__img" src="/images/honey-comb-92.png" style="position: relative; top: 10px;" />
  </div>
  <section id="tutorials-javascript-create-account" class="row tutorials-javascript-create-account">
	<h3>
		<a id="tutorials-javascript-create-account">
			JS: Create Account
			
		</a>
	</h3>
	
		<span class="description"><p><em>Create Steem account using Steemconnect as well as with client-side signing.</em></p>
</span>
	

	<p><span class="fa-pull-left top-of-tutorial-repo-link"><span class="first-word">Full</span>, runnable src of <a href="https://gitlab.syncad.com/hive/devportal/-/tree/master/tutorials/javascript/tutorials/26_create_account">Create Account</a> can be downloaded as part of: <a href="https://gitlab.syncad.com/hive/devportal/-/tree/master/tutorials/javascript">tutorials/javascript</a>.</span>
<br /></p>

<p>This tutorial will show how to search for a valid account name and then create a new account by means of Resource Credits or STEEM. This tutorial runs on the main Steem blockchain so extra care needs to be taken as any operation will affect real accounts.</p>

<h2 id="intro">Intro</h2>

<p>This tutorial will show few functions such as querying account by name and check if username is taken or available to register. We are using the <code class="highlighter-rouge">call</code> function provided by the <code class="highlighter-rouge">dsteem</code> library to pull account from the Steem blockchain. We then create proper private keys for new account. A simple HTML interface is used to enter payment of account creation fee and create account right inside tutorial. We use the <code class="highlighter-rouge">account_create</code> function to commit the transaction to the blockchain. This function is used to create what is called a “non-discounted account”. This means that the creator account needs to supply the exact <code class="highlighter-rouge">account_creation_fee</code> in STEEM in order for the transaction to process successfully. Currently this value is set to 3 STEEM. There is a second method of creating accounts using tokens. These are called “discounted accounts”. In stead of STEEM, the <code class="highlighter-rouge">account_creation_fee</code> is paid in RC (resource credits). There are however a limited amount of discounted accounts that can be claimed which is decided upon by the witnesses. This account creation process is done in two steps, first claiming an account and then creating the account.</p>

<h2 id="steps">Steps</h2>

<ol>
  <li><a href="#app-setup"><strong>App setup</strong></a> Setup <code class="highlighter-rouge">dsteem</code> to use the proper connection and network.</li>
  <li><a href="#search-account"><strong>Search account</strong></a> Get account details after input has account name</li>
  <li><a href="#generate-keys"><strong>Generate private keys</strong></a> Generate proper keys for new account</li>
  <li><a href="#create-account"><strong>Create account</strong></a> Create account via Client-side or Steemconnect</li>
</ol>

<h4 id="1-app-setup-">1. App setup <a name="app-setup"></a></h4>

<p>Below we have <code class="highlighter-rouge">dsteem</code> pointing to the production network with the proper chainId, addressPrefix, and endpoint. There is a <code class="highlighter-rouge">public/app.js</code> file which holds the Javascript segment of this tutorial. In the first few lines we define the configured library and packages:</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">const</span> <span class="nx">dsteem</span> <span class="o">=</span> <span class="nx">require</span><span class="p">(</span><span class="dl">'</span><span class="s1">dsteem</span><span class="dl">'</span><span class="p">);</span>
<span class="kd">let</span> <span class="nx">opts</span> <span class="o">=</span> <span class="p">{};</span>
<span class="c1">//connect to production server</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">STM</span><span class="dl">'</span><span class="p">;</span>
<span class="nx">opts</span><span class="p">.</span><span class="nx">chainId</span> <span class="o">=</span>
    <span class="dl">'</span><span class="s1">0000000000000000000000000000000000000000000000000000000000000000</span><span class="dl">'</span><span class="p">;</span>
<span class="c1">//connect to server which is connected to the network/production</span>
<span class="kd">const</span> <span class="nx">client</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">Client</span><span class="p">(</span><span class="dl">'</span><span class="s1">https://api.steemit.com</span><span class="dl">'</span><span class="p">);</span>
</code></pre></div></div>

<h4 id="2-search-account-">2. Search account <a name="search-account"></a></h4>

<p>After account name field is filled with some name, tutorial has Search button to search for account by name. HTML input forms can be found in the <code class="highlighter-rouge">index.html</code> file. The values are pulled from that screen with the below:</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">const</span> <span class="nx">accSearch</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">username</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
<span class="kd">let</span> <span class="nx">avail</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">Account is NOT available to register</span><span class="dl">'</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">accSearch</span><span class="p">.</span><span class="nx">length</span> <span class="o">&gt;</span> <span class="mi">2</span><span class="p">)</span> <span class="p">{</span>
    <span class="kd">const</span> <span class="nx">_account</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">client</span><span class="p">.</span><span class="nx">database</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="dl">'</span><span class="s1">get_accounts</span><span class="dl">'</span><span class="p">,</span> <span class="p">[</span>
        <span class="p">[</span><span class="nx">accSearch</span><span class="p">],</span>
    <span class="p">]);</span>
    <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">`_account:`</span><span class="p">,</span> <span class="nx">_account</span><span class="p">,</span> <span class="nx">accSearch</span><span class="p">.</span><span class="nx">length</span><span class="p">);</span>

    <span class="k">if</span> <span class="p">(</span><span class="nx">_account</span><span class="p">.</span><span class="nx">length</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
        <span class="nx">avail</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">Account is available to register</span><span class="dl">'</span><span class="p">;</span>
    <span class="p">}</span>
<span class="p">}</span>
<span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">accInfo</span><span class="dl">'</span><span class="p">).</span><span class="nx">innerHTML</span> <span class="o">=</span> <span class="nx">avail</span><span class="p">;</span>
</code></pre></div></div>

<p>We will then do simple check if account is taken or not.</p>

<h4 id="3-generate-private-keys-">3. Generate private keys <a name="generate-keys"></a></h4>

<p>After we know that account is available to register, we will fill form with password we wish for that account and enter creation fee. Note, that creation fees are “burned” once the new account is created. The creator account wishes to provide the new account with VEST (as per previous account creation process) they can do so by following the <code class="highlighter-rouge">delegate_vesting_shares</code> process (refer tutorial <a href="https://developers.steem.io/tutorials-javascript/delegate_power">#27</a>). Irrespective of which account creation method is being followed, the process for generating new accounts keys is the same for both.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="kd">const</span> <span class="nx">username</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">username</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>
<span class="kd">const</span> <span class="nx">password</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">password</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">;</span>

<span class="kd">const</span> <span class="nx">ownerKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromLogin</span><span class="p">(</span><span class="nx">username</span><span class="p">,</span> <span class="nx">password</span><span class="p">,</span> <span class="dl">'</span><span class="s1">owner</span><span class="dl">'</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">activeKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromLogin</span><span class="p">(</span><span class="nx">username</span><span class="p">,</span> <span class="nx">password</span><span class="p">,</span> <span class="dl">'</span><span class="s1">active</span><span class="dl">'</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">postingKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromLogin</span><span class="p">(</span><span class="nx">username</span><span class="p">,</span> <span class="nx">password</span><span class="p">,</span> <span class="dl">'</span><span class="s1">posting</span><span class="dl">'</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">memoKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromLogin</span><span class="p">(</span>
    <span class="nx">username</span><span class="p">,</span>
    <span class="nx">password</span><span class="p">,</span>
    <span class="dl">'</span><span class="s1">memo</span><span class="dl">'</span>
<span class="p">).</span><span class="nx">createPublic</span><span class="p">(</span><span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span><span class="p">);</span>

<span class="kd">const</span> <span class="nx">ownerAuth</span> <span class="o">=</span> <span class="p">{</span>
    <span class="na">weight_threshold</span><span class="p">:</span> <span class="mi">1</span><span class="p">,</span>
    <span class="na">account_auths</span><span class="p">:</span> <span class="p">[],</span>
    <span class="na">key_auths</span><span class="p">:</span> <span class="p">[[</span><span class="nx">ownerKey</span><span class="p">.</span><span class="nx">createPublic</span><span class="p">(</span><span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span><span class="p">),</span> <span class="mi">1</span><span class="p">]],</span>
<span class="p">};</span>
<span class="kd">const</span> <span class="nx">activeAuth</span> <span class="o">=</span> <span class="p">{</span>
    <span class="na">weight_threshold</span><span class="p">:</span> <span class="mi">1</span><span class="p">,</span>
    <span class="na">account_auths</span><span class="p">:</span> <span class="p">[],</span>
    <span class="na">key_auths</span><span class="p">:</span> <span class="p">[[</span><span class="nx">activeKey</span><span class="p">.</span><span class="nx">createPublic</span><span class="p">(</span><span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span><span class="p">),</span> <span class="mi">1</span><span class="p">]],</span>
<span class="p">};</span>
<span class="kd">const</span> <span class="nx">postingAuth</span> <span class="o">=</span> <span class="p">{</span>
    <span class="na">weight_threshold</span><span class="p">:</span> <span class="mi">1</span><span class="p">,</span>
    <span class="na">account_auths</span><span class="p">:</span> <span class="p">[],</span>
    <span class="na">key_auths</span><span class="p">:</span> <span class="p">[[</span><span class="nx">postingKey</span><span class="p">.</span><span class="nx">createPublic</span><span class="p">(</span><span class="nx">opts</span><span class="p">.</span><span class="nx">addressPrefix</span><span class="p">),</span> <span class="mi">1</span><span class="p">]],</span>
<span class="p">};</span>
</code></pre></div></div>

<p>Above script shows, how to properly setup private keys of new account.</p>

<h4 id="4-create-account-">4. Create account <a name="create-account"></a></h4>

<p>After following all steps properly, we can now submit transaction to create new account.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">//non-discounted account creation</span>
<span class="kd">const</span> <span class="nx">privateKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromString</span><span class="p">(</span>
    <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">wif</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span>
<span class="p">);</span>
<span class="kd">const</span> <span class="nx">op</span> <span class="o">=</span> <span class="p">[</span>
    <span class="dl">'</span><span class="s1">account_create</span><span class="dl">'</span><span class="p">,</span>
    <span class="p">{</span>
        <span class="na">fee</span><span class="p">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">steem</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">,</span>
        <span class="na">creator</span><span class="p">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">account</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">,</span>
        <span class="na">new_account_name</span><span class="p">:</span> <span class="nx">username</span><span class="p">,</span>
        <span class="na">owner</span><span class="p">:</span> <span class="nx">ownerAuth</span><span class="p">,</span>
        <span class="na">active</span><span class="p">:</span> <span class="nx">activeAuth</span><span class="p">,</span>
        <span class="na">posting</span><span class="p">:</span> <span class="nx">postingAuth</span><span class="p">,</span>
        <span class="na">memo_key</span><span class="p">:</span> <span class="nx">memoKey</span><span class="p">,</span>
        <span class="na">json_metadata</span><span class="p">:</span> <span class="dl">''</span><span class="p">,</span>
    <span class="p">},</span>
<span class="p">];</span>

<span class="nx">client</span><span class="p">.</span><span class="nx">broadcast</span><span class="p">.</span><span class="nx">sendOperations</span><span class="p">([</span><span class="nx">op</span><span class="p">],</span> <span class="nx">privateKey</span><span class="p">).</span><span class="nx">then</span><span class="p">(</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="p">{</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">result</span><span class="dl">'</span><span class="p">).</span><span class="nx">style</span><span class="p">.</span><span class="nx">display</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">block</span><span class="dl">'</span><span class="p">;</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span>
            <span class="dl">'</span><span class="s1">result</span><span class="dl">'</span>
        <span class="p">).</span><span class="nx">innerHTML</span> <span class="o">=</span> <span class="s2">`&lt;br/&gt;&lt;p&gt;Included in block: </span><span class="p">${</span>
            <span class="nx">result</span><span class="p">.</span><span class="nx">block_num</span>
        <span class="p">}</span><span class="s2">&lt;/p&gt;&lt;br/&gt;&lt;br/&gt;`</span><span class="p">;</span>
    <span class="p">},</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">error</span><span class="p">(</span><span class="nx">error</span><span class="p">);</span>
    <span class="p">}</span>
<span class="p">);</span>
</code></pre></div></div>

<p>Discounted account creation uses the same eventual <code class="highlighter-rouge">account_create</code> parameters but does not include the optional <code class="highlighter-rouge">fee</code> parameter. We also check to see if the creator account has an <code class="highlighter-rouge">account_creation_token</code> available already and then skips the first section of claiming this token.</p>

<div class="language-javascript highlighter-rouge"><div class="highlight"><pre class="highlight"><code><span class="c1">//discounted account creation</span>
<span class="c1">//private active key of creator account</span>
<span class="kd">const</span> <span class="nx">privateKey</span> <span class="o">=</span> <span class="nx">dsteem</span><span class="p">.</span><span class="nx">PrivateKey</span><span class="p">.</span><span class="nx">fromString</span><span class="p">(</span><span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">wif</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">);</span>

<span class="kd">let</span> <span class="nx">ops</span> <span class="o">=</span> <span class="p">[];</span>

<span class="c1">//claim discounted account operation</span>
<span class="kd">const</span> <span class="nx">creator</span> <span class="o">=</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">account</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span>
<span class="kd">const</span> <span class="nx">_account</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">client</span><span class="p">.</span><span class="nx">database</span><span class="p">.</span><span class="nx">call</span><span class="p">(</span><span class="dl">'</span><span class="s1">get_accounts</span><span class="dl">'</span><span class="p">,</span> <span class="p">[</span>
    <span class="p">[</span><span class="nx">creator</span><span class="p">],</span>
<span class="p">]);</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="dl">'</span><span class="s1">current pending claimed accounts: </span><span class="dl">'</span> <span class="o">+</span> <span class="nx">_account</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">pending_claimed_accounts</span><span class="p">)</span>
<span class="k">if</span> <span class="p">(</span><span class="nx">_account</span><span class="p">[</span><span class="mi">0</span><span class="p">].</span><span class="nx">pending_claimed_accounts</span> <span class="o">==</span> <span class="mi">0</span><span class="p">)</span> <span class="p">{</span>
    <span class="kd">const</span> <span class="nx">claim_op</span> <span class="o">=</span> <span class="p">[</span>
        <span class="dl">'</span><span class="s1">claim_account</span><span class="dl">'</span><span class="p">,</span>
        <span class="p">{</span>
            <span class="na">creator</span><span class="p">:</span> <span class="nx">creator</span><span class="p">,</span>
            <span class="na">fee</span><span class="p">:</span> <span class="dl">'</span><span class="s1">0.000 STEEM</span><span class="dl">'</span><span class="p">,</span>
            <span class="na">extensions</span><span class="p">:</span> <span class="p">[],</span>
        <span class="p">}</span>
    <span class="p">];</span>
    <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="dl">'</span><span class="s1">You have claimed a token</span><span class="dl">'</span><span class="p">)</span>
    <span class="nx">ops</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">claim_op</span><span class="p">)</span>
<span class="p">}</span>

<span class="c1">//create operation to transmit</span>
<span class="kd">const</span> <span class="nx">create_op</span> <span class="o">=</span> <span class="p">[</span>
    <span class="dl">'</span><span class="s1">create_claimed_account</span><span class="dl">'</span><span class="p">,</span>
    <span class="p">{</span>
        <span class="na">creator</span><span class="p">:</span> <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">account</span><span class="dl">'</span><span class="p">).</span><span class="nx">value</span><span class="p">,</span>
        <span class="na">new_account_name</span><span class="p">:</span> <span class="nx">username</span><span class="p">,</span>
        <span class="na">owner</span><span class="p">:</span> <span class="nx">ownerAuth</span><span class="p">,</span>
        <span class="na">active</span><span class="p">:</span> <span class="nx">activeAuth</span><span class="p">,</span>
        <span class="na">posting</span><span class="p">:</span> <span class="nx">postingAuth</span><span class="p">,</span>
        <span class="na">memo_key</span><span class="p">:</span> <span class="nx">memoKey</span><span class="p">,</span>
        <span class="na">json_metadata</span><span class="p">:</span> <span class="dl">''</span><span class="p">,</span>
        <span class="na">extensions</span><span class="p">:</span> <span class="p">[]</span>
    <span class="p">},</span>
<span class="p">];</span>
<span class="nx">ops</span><span class="p">.</span><span class="nx">push</span><span class="p">(</span><span class="nx">create_op</span><span class="p">)</span>

<span class="c1">//broadcast operation to blockchain</span>
<span class="nx">client</span><span class="p">.</span><span class="nx">broadcast</span><span class="p">.</span><span class="nx">sendOperations</span><span class="p">(</span><span class="nx">ops</span><span class="p">,</span> <span class="nx">privateKey</span><span class="p">).</span><span class="nx">then</span><span class="p">(</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">result</span><span class="p">)</span> <span class="p">{</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span><span class="dl">'</span><span class="s1">result</span><span class="dl">'</span><span class="p">).</span><span class="nx">style</span><span class="p">.</span><span class="nx">display</span> <span class="o">=</span> <span class="dl">'</span><span class="s1">block</span><span class="dl">'</span><span class="p">;</span>
        <span class="nb">document</span><span class="p">.</span><span class="nx">getElementById</span><span class="p">(</span>
            <span class="dl">'</span><span class="s1">result</span><span class="dl">'</span>
        <span class="p">).</span><span class="nx">innerHTML</span> <span class="o">=</span> <span class="s2">`&lt;br/&gt;&lt;p&gt;Included in block: </span><span class="p">${</span>
            <span class="nx">result</span><span class="p">.</span><span class="nx">block_num</span>
        <span class="p">}</span><span class="s2">&lt;/p&gt;&lt;br/&gt;&lt;br/&gt;`</span><span class="p">;</span>
    <span class="p">},</span>
    <span class="kd">function</span><span class="p">(</span><span class="nx">error</span><span class="p">)</span> <span class="p">{</span>
        <span class="nx">console</span><span class="p">.</span><span class="nx">error</span><span class="p">(</span><span class="nx">error</span><span class="p">);</span>
    <span class="p">}</span>
<span class="p">);</span>
</code></pre></div></div>

<p>That’s it!</p>

<h3 id="to-run-this-tutorial">To run this tutorial</h3>

<ol>
  <li><code class="highlighter-rouge">git clone https://gitlab.syncad.com/hive/devportal.git</code></li>
  <li><code class="highlighter-rouge">cd devportal/tutorials/javascript/26_create_account</code></li>
  <li><code class="highlighter-rouge">npm i</code></li>
  <li><code class="highlighter-rouge">npm run dev-server</code> or <code class="highlighter-rouge">npm run start</code></li>
  <li>After a few moments, the server should be running at <a href="http://localhost:3000/">http://localhost:3000/</a></li>
</ol>

<hr />

</section>

</div>
<div class="footer">
  <a href="#">Back to top</a>
</div>
<script>
    document.getElementById("open-nav").addEventListener("click", function () {
        document.body.classList.toggle("nav-open");
    });
</script>
</body>
</html>


<script src="/js/adjust.js"></script>

